import { getCurrentLngLat, getLocationByIp, inverseGeocoding } from "./gps";
export default {
    text(table, field_name, field_option, title_map, value, option, type) {
        var _type = typeof type == 'string' ? type : 'text';
        return `<div for="field-` + field_name + `" class="weui-cell">
                  <div class="weui-cell__hd"><span class="weui-label">` + title_map[field_name] + `</span></div>
                  <div class="weui-cell__bd">
                      <input type="` + _type + `" id="field-` + field_name + `" onchange="QEditor.QE_DATA.` + field_name + `=this.value;" value="` + (QEditor.QE_DATA[field_name] || '') + `" class="weui-input" placeholder="请输入` + title_map[field_name] + `"/>
                  </div>
                </div>`;
    },
    number(table, field_name, field_option, title_map, value, option) {
        return this.text(table, field_name, field_option, title_map, value, option, 'number');
    },
    decimal(table, field_name, field_option, title_map, value, option) {
        return this.text(table, field_name, field_option, title_map, value, option, 'decimal');
    },
    date(table, field_name, field_option, title_map, value, option) {
        return this.text(table, field_name, field_option, title_map, value, option, 'date');
    },
    datetime(table, field_name, field_option, title_map, value, option) {
        return this.text(table, field_name, field_option, title_map, value, option, 'datetime-local');
    },
    hidden(table, field_name, field_option, title_map, value, option) {
        return `<input type="hidden" id="field-` + field_name + `"  onchange="QEditor.QE_DATA.` + field_name + `=this.value;" value="` + QEditor.QE_DATA[field_name] + `" >`;
    },

    textarea(table, field_name, field_option, title_map, value, option) {

        return `<div class="weui-cell weui-cell_vertical">
                    <div class="weui-cell__hd"><label for="field-` + field_name + `" class="weui-label">` + title_map[field_name] + `</label></div>
                    <div class="weui-cell__bd">
                      <textarea id="field-` + field_name + `"   onchange="QEditor.QE_DATA.` + field_name + `=this.value;" value="` + QEditor.QE_DATA[field_name] + `" class="weui-textarea" placeholder="请输入` + title_map[field_name] + `" rows="5">` + QEditor.QE_DATA[field_name] + `</textarea> 
                    </div>
                </div>`;
    },
    switch(table, field_name, field_option, title_map, value, option) {
        return `<div class="weui-cell weui-cell_active weui-cell_switch">
                  <div class="weui-cell__bd" id="label-` + field_name + `" ><span class="weui-label">` + title_map[field_name] + `</span></div>
                  <div class="weui-cell__ft">
                      <input  id="field-` + field_name + `" onchange="QEditor.QE_DATA.` + field_name + `=!QEditor.QE_DATA.` + field_name + `;" value="` + QEditor.QE_DATA[field_name] + `" class="weui-switch" type="checkbox" ` + (value[field_name] ? 'checked="checked"' : '') + `>
                  </div>
              </div>`;
    },
    editor(table, field_name, field_option, title_map, value, option) {
        return `<div class="weui-cell weui-cell-editor  weui-cell_vertical">
                    <div class="weui-cell__hd"><label for="field-` + field_name + `" class="weui-label">` + title_map[field_name] + `</label><span class="placeholder">` + field_option['placeholder'] + `</span></div>
                    <div class="weui-cell__bd">
                    <div id="editor-` + field_name + `" class="QE_DATA_EDITOR" >` + QEditor.QE_DATA[field_name] + `</div>  
                    </div>
                    <script>QEditor.require(['editor'],function() { QEditor.init_tinymce('` + field_name + `');})</script>
                </div>`;
    },
    attr_files(table, field_name, field_option, title_map, value, option) {
        return this.upload(table, title_map[field_name], field_name, field_option, value, '', option);
    },
    image(table, field_name, field_option, title_map, value, option) {
        return this.upload(table, title_map[field_name], field_name, field_option, value, 'image/*', option);
    },
    images(table, field_name, field_option, title_map, value, option) {
        return this.upload(table, title_map[field_name], field_name, field_option, value, 'image/*', option);
    },
    file(table, field_name, field_option, title_map, value, option) {
        return this.upload(table, title_map[field_name], field_name, field_option, value, '', option);
    },
    files(table, field_name, field_option, title_map, value, option) {
        return this.upload(table, title_map[field_name], field_name, field_option, value, '', option);
    },
    attr(table, field_name, field_option, title_map, value, option) {
        var html_file = '';
        if (value) {
            html_file = QEditor.renderAttrs(field_name, true);
        }
        var html = ` 
            <div class="weui-cell weui-cell_vertical">  
                <div class="weui-cell__hd">
                    <span class="weui-label">` + title_map[field_name] + `</span>   
                    <span class="placeholder">` + (field_option['placeholder'] || '') + `</span>
                    <span class="pointer right" onclick="QEditor.editAttr('` + field_name + `')"> + </span>
                </div>
                <div class="weui-cell__bd" style="margin-top: 10px">
                    <ul id="field-` + field_name + `-options" >` + html_file + `</ul> 
                </div> 
            </div>  `;

        return html;
    },
    upload(table, title, field, field_option, value, accept, option) {

        var type = field_option['type'], html_file = '', is_image = ['image', 'images'].indexOf(type) > -1;
        if (value) {
            // if (typeof value == "string") {
            //     html_file += '<li class="weui-uploader__file" style="background-image: url(' + value + ');"></li>';
            // }else{
            //
            // }
            html_file = QEditor.renderFiles(field, true);

        }
        var html = ` 
            <div class="weui-cell  weui-cell_uploader">
                <div class="weui-cell__bd">
                <div class="weui-uploader">
                    <div class="weui-uploader__hd">
                        <span class="weui-uploader__title">` + title + `</span>  
                        <span class="placeholder">` + field_option['placeholder'] + `</span>
                    </div>
                    <div class="weui-uploader__bd">
                        <ul class="weui-uploader__files" id="field-` + field + `-files" >` + html_file + `</ul>
                        <div class="weui-uploader__input-box">
                            <input id="field-` + field + `" name="` + field + `" class="weui-uploader__input" type="file" accept="` + accept + `" />
                        </div>
                    </div>
                </div>
            </div>  
        <script>
        QEditor.require('simpleUpload',function (){  
            $('#field-` + field + `').simpleUpload({
                url: QEditor.url()+'` + option.upload_url + `',
                method: 'post',
                params: {'type': '` + type + `','table': '` + table + `'},
                xhrFields: {
                    withCredentials: true
                },
                headers: {'x-hash': localStorage.getItem('_t_')},
                ajax: { dataType: 'json', success(res){QEditor.UploadDone('` + field + `',res)}}
            }) 
        })</script>
        </div>`;
        return html;
    },
    select(table, field_name, field_option, title_map, value, option) {

        var html = '';

        for (var i in field_option.option_value) {
            html += '<option value="' + i + '" selected="' + (value && value === i ? 'selected' : '') + '">' + field_option['option_value'][i] + '</option> ';
        }

        return `<div for="field-` + field_name + `" class="weui-cell weui-cell_select weui-cell_select-after">
                  <div class="weui-cell__hd">
                      <span class="weui-label">` + title_map[field_name] + `</span>
                      <span class="placeholder">` + field_option['placeholder'] + `</span>
                  </div>
                  <div class="weui-cell__bd">
                      <select class="weui-select" onchange="QEditor.QE_DATA.` + field_name + `=this.value;" value="` + QEditor.QE_DATA[field_name] + `" name="field-` + field_name + `" id="field-` + field_name + `">` + html + `</select>
                  </div>
              </div>`;
    },
    address(table, field_name, field_option, title_map, value, option) {

        var html = '';

        return `<div for="field-` + field_name + `" class="weui-cell">
                  <div class="weui-cell__hd">
                      <span class="weui-label">` + title_map[field_name] + `</span>
                  </div>
                  <div class="weui-cell__bd"> 
                     <input id="field-` + field_name + `" name="` + field_name + `"  type="text" class="weui-input" placeholder="请输入` + title_map[field_name] + `"  onchange="QEditor.QE_DATA.` + field_name + `=this.value;" value="` + QEditor.QE_DATA[field_name] + `"/>
                  </div>
                  <div class="weui-cell__ft">
                    <button type="button"   class="weui-btn_reset weui-btn_icon">
                      <i role="img" alt="选择地址" class="js_target weui-icon-address" onclick="QEditor.getLocation('` + field_name + `')"></i>
                    </button>
                  </div> 
              </div><div class="field-debug-` + field_name + `" style="background: #EEE;font-size: 10px"></div>`;
    },
    relation(table, field_name, field_option, title_map, value, option, relation) {
        return `<div for="field-` + field_name + `" class="weui-cell">
                  <div class="weui-cell__hd"><span class="weui-label">` + title_map[field_name] + `</span></div>
                  <div class="weui-cell__bd">
                      <input type="text" readonly  onclick="QEditor.relationPicker('` + field_name + `',this)" value="` + (relation[field_name] || '') + `"  class="weui-input pointer" placeholder="请输入` + title_map[field_name] + `" id="relation-` + field_name + `-text"/> 
                      <input type="hidden"   id="field-` + field_name + `" onchange="QEditor.QE_DATA.` + field_name + `=this.value;" value="` + QEditor.QE_DATA[field_name] + `"  />
                  </div>
                </div> 
               `;
    },
    radio(table, field_name, field_option, title_map, value, option, relation, mini) {

        return this.checkbox(table, field_name, field_option, title_map, value, option, relation, mini);

    },

    checkbox(table, field_name, field_option, title_map, value, option, relation, mini) {

        if (typeof mini != "undefined" && mini) {
            return '<div data-field="' + field_name + '"  class="qedit-mini-field ' + (field_option.class || '') + ' qedit-mini-value">' + QEditor.miniValue(field_name) + '</div>'
        }

        var option_html = '', type = field_option.type,
            v = type == 'radio' ? (value[field_name] ? [value[field_name].toString()] : []) :
                (typeof value[field_name] != "object" ? (value[field_name] ? [value[field_name].toString()] : []) : value[field_name]);


        for (var i in field_option.option_value) {

            var flag = false;
            for (var k in v) {
                if (v[k] == i) {
                    flag = true;
                    break;
                }
            }
            option_html += '<span onclick="QEditor.selectedOption(\'' + field_name + '\',\'' + i + '\')" class="quiker-edit-option ' + ((value && flag) ? 'QEditor-selected' : '') + '">' + field_option['option_value'][i] + '</span> ';
        }

        return `<div class="weui-cell weui-cell_active weui-cell_vertical weui-select-options">
                <div class="weui-cell__hd"><label class="weui-label">` + title_map[field_name] + `</label> <span class="placeholder">` + field_option['placeholder'] + `</span></div>
                <div class="weui-cell__bd" id="field-` + field_name + `-options">` + option_html + `</div>
                </div> 
                `;
    },
    area(table, field_name, field_option, title_map, value, option, relation, mini) {
        var exhtml = '', option_html = '', multi = false;

        if (typeof mini != "undefined" && mini) {
            return '<div class="weui-cell ' + (field_option.class || '') + '" ><div  data-field="' + field_name + '" class="qedit-mini-field"><span class="qedit-mini-value">' + QEditor.miniValue(field_name, 1) + '</span></div></div>'
        }


        return `<div class="weui-cell weui-cell_active weui-cell_vertical weui-select-options area-field">
                    <div class="weui-cell__hd">
                        <label class="weui-label">` + title_map[field_name] + `</label> <input class="placeholder weui-input single-area pointer" onclick="QEditor.dialogArea('` + field_name + `')" data-single-area-field="` + field_name + `" placeholder="请选择" readonly value="` + QEditor.miniValue(field_name) + `">
                    </div>  
                </div> `;

    },
    multiArea(table, field_name, field_option, title_map, value, option, relation) {

        return `<div class="weui-cell weui-cell_active weui-cell_vertical weui-select-options area-field">
                    <div class="weui-cell__hd">
                        <label class="weui-label">` + title_map[field_name] + `</label><span class="qedit-select-area" onclick="QEditor.dialogArea('` + field_name + `','create')">选择</span>
                    </div> 
                   <div class="weui-cell__bd multi-areas" id="field-` + field_name + `-areas">` + QEditor.renderAreas(field_name) + `</div>
                </div> `;

    },
    json(table, field_name, field_option, title_map, value, option) {
        return `<div class="weui-cell weui-cell_horizontal json-editor-container">
                    <div class="weui-cell__hd">
                        <label for="field-${field_name}" class="weui-label">${title_map[field_name]}</label>
                        <span class="placeholder">${field_option['placeholder'] || ''}</span>
                    </div>
                    <div class="weui-cell__bd">
                        <div id="jsoneditor-${field_name}" style="height: 400px;"></div>
                    </div>
                </div> 
                <script>
                QEditor.require(['jsoneditor'], function() {
                    const container = document.getElementById("jsoneditor-${field_name}");
                    const options = {
                        mode: 'code',
                        modes: ['tree', 'view', 'form', 'code', 'text'],
                        onChange: function() {
                            try {
                                const json = editor.get();
                                QEditor.QE_DATA['${field_name}'] = JSON.stringify(json);
                            } catch (e) {
                                console.error('Invalid JSON:', e);
                            }
                        }
                    };
                    const editor = new JSONEditor(container, options);
                    
                    // 如果有现有数据,则加载
                    if (QEditor.QE_DATA['${field_name}']) {
                        try {
                            const json = JSON.parse(QEditor.QE_DATA['${field_name}']);
                            editor.set(json);
                        } catch (e) {
                            console.error('Invalid JSON:', e);
                        }
                    }
                });
                </script>`;
    },color(table, field_name, field_option, title_map, value, option) {
        return `<div for="field-${field_name}" class="weui-cell">
                  <div class="weui-cell__hd"><span class="weui-label">${title_map[field_name]}</span></div>
                  <div class="weui-cell__bd">
                      <input type="color" id="field-${field_name}" 
                             onchange="QEditor.QE_DATA.${field_name}=this.value;" 
                             value="${QEditor.QE_DATA[field_name] || '#000000'}" 
                             class="weui-input" />
                  </div>
                </div>`;
    }

}